<template>
  <b-container>
    <b-row>
      <b-col cols="4">
        <sides />
      </b-col>
      <b-col>
        <b-card title="新闻详情">
          <b-card-body>
            <h2 style="text-align: center">{{ details.title }}</h2>
            <div style="text-align: center">
              {{ details.lastUpdateDate }}
            </div>
            <div v-html="details.details" />
          </b-card-body>
        </b-card>
      </b-col>
    </b-row>
  </b-container>
</template>

<script>

import { getEditData } from '@/api/news/index'
import sides from '@/components/sides'

export default {
  name: 'Index',
  components: {
    sides
  },
  data() {
    return {
      details: {},
      id: this.$route.query.id
    }
  },
  watch: {
    '$route.query.id'(v) {
      this.id = v
      this.init()
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      getEditData(this.id).then(r => {
        const { data } = r
        this.details = data
      })
    }
  }
}
</script>

<style scoped>

</style>
